<template>
    <div class="main">
        <div class="top">
            <div class="topB">
                <div class="conR">
                    <p>工序</p>
                    <div>
                        <p class="apo">统计：{{zlkk.gxCount}}次</p>
                        <p>易发工序：{{zlkk.gxData.processName}} 累计：{{zlkk.gxData.count}}次</p>
                    </div>
                </div>
            </div>
            <div class="topB">
                <div class="conR">
                    <p>质量通病</p>
                    <div>
                        <p class="apo">统计：{{zlkk.zltbCount}}次</p>
                            <p>易发工序：{{ zlkk.zltbData == null ? '无' : zlkk.zltbData.qualityCategory }} 累计：{{ zlkk.zltbData == null ? 0 : zlkk.zltbData.count }}次</p>
                    </div>
                </div>
            </div>
            <div class="topB">
                <div class="conR">
                    <p>注意事项</p>
                    <div class="cc">{{zlkk.bsCount}}个</div>
                </div>
            </div>
            <div class="topB clear">
                <div class="conR">
                    <p>管控措施</p>
                    <div class="cc">{{zlkk.bsCount}}个</div>
                </div>
            </div>
        </div>
        <div class="scoll">
            <div class="bottom" :style="{ marginTop: marginTop + 'px' }">
                <table border="0">
                    <tr class="tr1">
                        <th>工序或场所</th>
                        <th>危险部分及危险源</th>
                        <th>事故及伤害类型</th>
                        <th>风险等级</th>
                        <th>控制措施</th>
                    </tr>
                    <tr class="tr2" v-for="(item,index) in arrly" :key="index">
                        <td>{{ item.hazard }}</td>
                        <td>{{ item.process }}</td>
                        <td>{{ item.types }}</td>
                        <td>{{ item.grade }}</td>
                        <td>{{ item.measures }}</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</template>
<script>
import { Chart } from '@antv/g2';
export default {
    data() {
        return {
            oss: "http://jjjt.oss-cn-shanghai.aliyuncs.com/",

            url: "",
            jindu: "",
            reasons: "",
            reasonsList: "",
            reasonsAll: "",
            liCheng: "",
            chanZ: "",
            sum: "",
            pro: 0,
            videoShow: false,
            arrly: "",
            tableList: "",
            realData: [],
            marginTop: 0, // 数据的margin-top
            marginTop1: 0,
            zlkk:""
        };
    },
    created() {

        this.timer = setInterval(this.fun, 1);

        
    },
    mounted() {

        this.$api
            .RiskIdentifyFindRiskIdentify({ section_id: localStorage.getItem("section_id") })
            .then((res) => {
                let data = res.data;

                // console.log(data)
                this.arrly = data;
            })
            .catch((error) => {
                console.log("错误:", error);
            });


   this.$api
            .count_PCCountRiskshowByFXYBS({ section_id: localStorage.getItem("section_id") })
            .then((res) => {
                let data = res.data;

                // console.log(data)
                this.zlkk = data;
            })
            .catch((error) => {
                console.log("错误:", error);
            });






    },
    methods: {
        fun() {
            var me = this;
            this.marginTop1 = me.datacount * 150 + 818;
            this.marginTop -= 0.1;
            this.marginTop1 -= 0.1;
            var count = me.datacount * 150;
            if (this.marginTop < -count) {

                this.marginTop = 0;
                this.marginTop1 = me.datacount * 150 + 818;
            }

        },
    },
};
</script>
<style src="./css/page12.css" scoped>
</style>
